<template>
  <div>
    <div class="work-experience primary-text" v-if="form.sta != 2 || form.editSta != data.id">
      <el-row>
        <el-col :span="20" class="work-experience-head">
          <!--公司名称公司名称公司名称-->
          {{data.companyName}}
          <span
            class="work-experience-time"
          >{{data.workStartTime}} / {{data.workEndTime}}</span>
        </el-col>
        <el-col :span="2" class="orange-text">
          <div @click="editContent(data.id)">
            <img src="../../../assets/img/resume/bianji.png" width="14px" height="14px">
            编辑
          </div>
        </el-col>
        <el-col :span="2" class="orange-text">
          <div @click="doDelete(data.id)">
            <img src="../../../assets/img/resume/detele.png" width="14px" height="14px">
            删除
          </div>
        </el-col>
      </el-row>
      <el-row style="padding:16px 0 19px 0">
        <span>
          <!--职位名称-->
          {{data.jobName}}
        </span>
        <span class="line-padding">|</span>
        <span>
          <!--执业类型-->
          {{data.parentLicenseType}}-{{data.sonLicenseType}}
        </span>
        <span class="line-padding">|</span>
        <span>
          <!--企业类型-->
          {{data.companyType}}
        </span>
        <span class="line-padding">|</span>
        <span>
          <!--所在地区-->
          {{data.workCity}}
        </span>
      </el-row>
      <el-row>
        <p v-html="data.workContent"></p>
      </el-row>
    </div>

    <div class="edit-content" v-if="form.sta == 2 && form.editSta == data.id">
      <div class="all-job-resume">
        <el-form label-width="100px" label-position="right">
          <el-row>
            <el-col :span="12">
              <el-form-item label="企业名称">
                <el-input class="theme-input all-input" v-model="data.companyName"></el-input>
              </el-form-item>
              <el-form-item label="执业类型">
                <!-- <el-select class="all-input" v-model="data.licenseTypeId">
                  <el-option
                    v-for="(item,index) in practiceType"
                    :label="item.content"
                    :value="item.id"
                    :key="index"
                  ></el-option>
                </el-select>-->
                <el-cascader :options="practiceType||[]" :props="props" v-model="licenseIds"></el-cascader>
              </el-form-item>
              <el-form-item label="所在城市">
                <el-cascader :options="city" @change="getData" v-model="workCity"></el-cascader>
              </el-form-item>
            </el-col>
            <el-col :span="11" :offset="1">
              <el-form-item label="职位名称">
                <el-input class="theme-input all-input" v-model="data.jobName"></el-input>
              </el-form-item>
              <el-form-item label="企业类型">
                <el-select class="all-input" v-model="data.companyTypeId">
                  <el-option
                    v-for="(item,index) in enterpriseType"
                    :label="item.content"
                    :value="item.id"
                    :key="index"
                  ></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="任职时间">
                <el-date-picker
                  :editable="false"
                  class="resume-datepicker"
                  type="monthrange"
                  value-format="yyyy-MM"
                  range-separator="至"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期"
                  v-model="time"
                ></el-date-picker>
              </el-form-item>
            </el-col>
          </el-row>
          <el-form-item label="工作内容">
            <el-input type="textarea" placeholder="请输入" v-model="workContent"></el-input>
          </el-form-item>
          <el-form-item class="form-button-right">
            <el-button class="ghost-button" @click="cancel">取消</el-button>
            <el-button class="submit-button" @click="doSubmit">确认</el-button>
          </el-form-item>
        </el-form>
      </div>
    </div>
  </div>
</template>
<script>
import { chinaOptions, CodeToText, TextToCode } from '@/assets/utils/china.js'
import { constants } from 'crypto'
export default {
  props: ['form', 'enterpriseType', 'practiceType', 'cityType', 'data'],
  data() {
    return {
      city: chinaOptions,
      licenseIds: [],
      workCity: [],
      time: [],
      props: {
        value: 'licenseTypeId',
        children: 'licenseSonList',
        label: 'licenseType'
      },
      workContent: '',
      pickerOptions: {
        shortcuts: [
          {
            text: '今年至今',
            onClick(picker) {
              const end = new Date()
              const start = new Date(new Date().getFullYear(), 0)
              picker.$emit('pick', [start, end])
            }
          }
        ]
      }
    }
  },
  methods: {
    check() {
      if (
        this.data.companyName == '' ||
        this.data.companyTypeId == '' ||
        this.data.licenseTypeId == ' ' ||
        this.data.jobName == '' ||
        this.data.workContent == '' ||
        this.data.workCity == '' ||
        this.time == ''
      ) {
        _g.message('数据不能为空', 'warning')
        return false
      }
      return true
    },
    editContent(id) {
      //工作经历编辑方法
      this.form.sta = 2
      this.form.editSta = id
    },
    cancel() {
      this.$emit('on-pitch', true)
      this.form.sta = -1
      this.form.editSta = -1
    },
    doSubmit() {
      if (!this.check()) return false
      this.data.workContent = _g.getTextAreaTo(this.workContent)
      let params = {
        id: this.data.id,
        companyName: this.data.companyName,
        companyType: this.data.companyTypeId,
        licenseType: this.licenseIds[1],
        jobName: this.data.jobName,
        jobContent: this.data.workContent,
        workCity: this.data.workCity,
        jobStartTime: this.time[0],
        jobEndTime: this.time[1]
      }
      _g.apiPost('/talent/updateWorkExperience.do', params).then(res => {
        _g.toMessage(res)
        this.cancel()
      })
    },
    doDelete(id) {
      _g.apiPost('/talent/deleteWorkExperience.do', { workExpId: id }).then(
        res => {
          _g.toMessage(res)
          this.$emit('on-pitch', true)
        }
      )
    },
    getData(val) {
      // let l = []
      // for (let i in val) {
      //   l.push(CodeToText[val[i]])
      // }
      this.data.workCity = val.join('-')
    },
    setCityData() {
      // let l = []
      this.workCity = this.data.workCity.split('-')
      // this.workCity.push(TextToCode[l[0]])
      // this.workCity.push(TextToCode[l[0]][l[1]])
      this.licenseIds = JSON.parse(this.data.licenseIds)
    },
    setTimeData() {
      this.time.push(this.data.workStartTime)
      this.time.push(this.data.workEndTime)
    },
    formatData() {
      this.workContent = _g.getToTextArea(this.data.workContent)
    }
  },
  mounted() {
    this.setCityData()
    this.setTimeData()
    this.formatData()
  },
  components: {}
}
</script>

<style lang="scss" scoped>
</style>
